<template>
  <div class="sign">
    <van-nav-bar
        title="查看签名文件"
    />
    <h2 class="SignH1" v-if="!pdfFlag">
      您已完成信息收集，点击按钮可获取签名文件
    </h2>
    <h2 v-if="pdfFlag" class="SignH1">您正在查看健康告知PDF文档</h2>
    <div id="pdf-viewer" ref="pdfViewer" style="width: 100%"></div>
    <div style="margin: 20px 16px">
      <van-button
          round
          block
          type="info"
          size="normal"
          @click="SignOpen"
          class="onButton"
      >查看签名文件
      </van-button>
      <!-- src="http://10.9.139.14:8084/lifepolicy_outpdf/12a1730709525710.pdf" -->
    </div>
    <div style="margin: 20px 16px; padding-bottom: 20px">
      <van-button
          round
          block
          type="info"
          size="normal"
          @click="Toppage"
          class="onButton"
      >返回首页
      </van-button>
    </div>
  </div>
</template>

<script>
import Pdfh5 from "pdfh5";
import "pdfh5/css/pdfh5.css";
import {checkUser} from "@/api/list";

export default {
  components: {
    Pdfh5,
  },
  data() {
    return {
      pdfFlag: false,
      pdfData: "",
      pdfh5: null,
      form: {}
    };
  },
  created() {

    this.initData();

  },
  destroyed() {
  },
  methods: {
    initData() {
      console.info("initData")
      this.form.idType = this.$route.params.idType;
      this.form.name = this.$route.params.name;
      this.form.idNumber = this.$route.params.idNumber;

      checkUser(this.form)
          .then((res) => {
            let {code, success, obj} = res;
            if (code === -1 && obj !== null && success === false) {
              let pdfUrl = res.obj;
              this.pdfData = pdfUrl;
              // this.pdfData = this.$route.params.pdfUrl; // 获取路由参数
              // this.pdfData = this.pdfData.replace(/lifepolicy_outpdf/g, "life_outputpdf");
              console.log("this.pdfData :" + this.pdfData);
              this.pdfData = "data:application/pdf;base64," + this.pdfData
            }
          })
          .catch((err) => {
            console.log(err);
          });
    },
    SignOpen() {
      this.pdfFlag = true;
      this.loadPdf();
    },
    Toppage() {
      this.$router.push("/");
    },
    loadPdf() {
      // 使用 pdfH5 加载 PDF 文件
      this.$refs.pdfViewer.style.height = '100%';
      console.info("pdfH5.render");
      console.info("this.pdfData:" + this.pdfData);
      this.pdfh5 = new Pdfh5("#pdf-viewer", {
        pdfurl: this.pdfData,
      });
    },
  },
};
</script>

<style scoped lang="scss">
.sign {
  // height: 100%;
  width: 100%;
  height: 100vh;

  .SignH1 {
    padding: 30px 15px;
    text-align: center;
  }

  .pdf-iframe {
    width: 100%;
    height: 100%;
    border: none;
  }

  .onButton {
    font-size: 17px !important;
  }

  ::v-deep .van-nav-bar__title {
    font-size: 20px;
    font-weight: bold;
  }
}
</style>
